<template>
  <div>
    <h2>代码生成器</h2>
    <el-table ref="table" v-loading="loading" :data="tableData" :stripe="true">
      <el-table-column type="index" width="55" />
      <el-table-column :show-overflow-tooltip="true" prop="tableName" label="表名" width="200" />
      <el-table-column :show-overflow-tooltip="true" prop="engine" label="数据库引擎" width="100" />
      <el-table-column :show-overflow-tooltip="true" prop="coding" label="字符编码集" width="150" />
      <el-table-column :show-overflow-tooltip="true" prop="remark" label="备注" width="160" />
      <el-table-column prop="createTime" label="创建日期" width="180">
        <template slot-scope="scope">
          <span>{{ scope.row.createTime }}</span>
        </template>
      </el-table-column>
      <el-table-column label="操作" width="170px" align="center" fixed="right">
        <template slot-scope="scope">
          <el-button type="text" @click="toConfig(scope.row.tableName)">配置</el-button>
          <el-button type="text" @click="toPreview(scope.row.tableName)">预览</el-button>
          <el-button type="text" @click="toDownload(scope.row.tableName)">下载</el-button>
          <el-button type="text" @click="toGen(scope.row.tableName)">生成</el-button>
        </template>
      </el-table-column>
    </el-table>


    <el-dialog :visible.sync="previewShow" title="生成预览" fullscreen>
      <Previewer v-bind:table-name="currentTableName" />
    </el-dialog>

    <el-dialog :visible.sync="configShow" title="生成配置" fullscreen>
      <Configurator v-bind:table-name="currentTableName" />
    </el-dialog>

  </div>

</template>

<script>
import { getAllTable, download, generate } from '@/api/generator'
import { downloadFile } from '@/utils/index'
import Previewer from '@/components/Previewer'
import Configurator from '@/components/Configurator'
import { Notification } from 'element-ui'

export default {
  name: 'Index',
  components: { Previewer, Configurator },
  data() {
    return {
      loading: false,
      previewShow: false,
      configShow: false,
      currentTableName: null,
      tableData: [],
      multipleSelection: []
    }
  },

  created() {
    getAllTable().then(data => {
      this.tableData = data
      // console.log(data)
    })
  },

  methods: {
    toPreview(tableName) {
      this.currentTableName = tableName
      this.previewShow = true
    },
    toDownload(tableName) {
      // 打包下载
      download(tableName).then(data => {
        downloadFile(data, tableName, 'zip')
      })
    },
    toConfig(tableName) {
      this.currentTableName = tableName
      this.configShow = true
    },
    toGen(tableName) {
      // 生成代码
      generate(tableName).then(() => {
        Notification.success('生成成功')
      })
    }
  }
}
</script>

